<template>
	<view class="top"> 
		<view class="shang">
			<image src="../../static/logo.png" alt="钓尖江湖"/>
			<h3 class="diao">钓尖江湖</h3>
		</view>
		<view class="xia">
			<p>
				钩尖江湖栏目互装设备齐上阵，足迹踏追大江南北，行钓间尽享大自然的馈赠，领略别样乡土民俗，最真实客观的镜头演绎渔者的江湖传奇，拍摄经历重巨考验，多角度展现，深层次解析，钩尖旁发生的一切。
			</p>
		</view>
		<view class="zhong">
			
		</view>
		<view class="lists">
			<ul class="ul">
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
				<li class="li">
					<image class="image" src="../../../../static/1.png" alt="快乐垂钓"/>
					<p class="p">《钩尖江湖》第2号第24期夜菜泡子 高家水库寻大草</p>
				</li>
			</ul>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return{
				
			}
		}
	}
</script>

<style lang="scss">
	.top{
		width: 100vw;
		height: 100vh;
		.shang{
			width: 100vw;
			height: 30vh;
			background-color: rgba(0, 0, 0, 0.8);
			
			text-align: center;
			image{
				margin-top: 30rpx;
				width: 200rpx;
				height: 200rpx;
			}
			.diao{
				color: white;
				font-size: 48rpx
			}
		}
		.xia{
			padding: 10rpx;
			font-size: 32rpx
		}
	}
	.zhong{
		width: 100vw;
		height: 20rpx;
		background-color: rgba(0, 0, 0, 0.1);
	}
	.lists{
		width: 100vw;
		padding: 10rpx;
		.ul{
			list-style: none;
			display:flex;
			justify-content: space-around;
			flex-wrap: wrap;
			.li{
				width: 45vw;
				height: 20vh;
				margin-top: 20rpx;
				margin-bottom: 20rpx;
				.image{
					width: 45vw;
					height: 15vh;
				}
				.p{
					font-size:28rpx
				}
				
			}
		}
	}
</style>